<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <title>开发</title>
    <link rel="stylesheet" type="text/css" href="../css/api.css"/>
    <link rel="stylesheet" type="text/css" href="../css/style.css"/>
    <style>
        body{background:#EFEFF4;}
.shareCard_search {
    padding: 10px;
    padding-bottom: 5px;
    overflow: hidden;
}
.shareCard_search input {
    width: 70%;
    border: 0;
    height: 30px;
    border-radius: 3px;
    float: left;
    padding: 0 5px;
    background: #fff;
}
.shareCard_search button {
    width: 20%;
    border: 0;
    height: 30px;
    color: #fff;
    border-radius: 3px;
    font-size: 14px;
    background: #ec6d65;
    float: right;
}
#add {
    list-style: none;
    padding: 0;
    margin: 0;
    width: 100%;
    text-align: left;
    padding: 10px 10px 0;
    box-sizing: border-box;
    background:#EFEFF4;
}
#add .data_items {
    background: #fff;
    border-radius: 5px;
    margin-bottom: 10px;
}
#add .data_items a {
    display: block;
    color: #333;
    font-size: 17px;
}
.order_list {
    position: relative;
    overflow: hidden;
    line-height: 30px;
    font-size: 14px;
}
.order_title {
    color: #fff;
    background: #ec6d65;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
#add .order_content {
    font-size: 14px;
}
#add .order_bottom {
    font-size: 14px;
}
.c_l {
    width: 70%;
    float: left;
    padding-left: 10px;
}
.c_r {
    position: absolute;
    display: block;
    right: 10px;
    height: 30px;
    line-height: 30px;
}
.order_list .data_item {
    position: relative;
    overflow: hidden;
}
#add .order_content .data_item {
    margin-top: 0;
}

.order_detail {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 16px;
    width: 100%;
    min-height: 100%;
    padding-top: 10px;
    z-index: 40;
    display: none;
}
.order_detail_wrap {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    min-height: 100%;
    z-index: 41;
    background: rgba(0,0,0,.7);
}
.order_detail_content {
    padding: 10px;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 42;
}
.item_data {
    background: #fff;
    margin-top: 10px;
    border-radius: 5px;
    line-height: 30px;
    color: #666;
    width: 100%;
    overflow: hidden;
}
.order_list {
    position: relative;
    overflow: hidden;
    line-height: 30px;
    font-size: 14px;
}
.order_title {
    color: #fff;
    background: #ec6d65;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.padding_contn {
    min-height: 120px;
    max-height: 330px;
    overflow: hidden;
}
.padding_contn {
    padding: 10px;
}
.order_detail_rule {
    font-size: 14px;
    line-height: 24px;
    color: #8B8A8A;
    margin: 10px 0 0;
    padding: 0 10px;
}
#goback {
    width: 30%;
    margin: 30px auto 15px;
    display: block;
    height: 40px;
    border: 0;
    background: #ec6d65;
    border-radius: 5px;
    font-size: 16px;
    color: #fff;
}
.search_box{
    width:100%;box-sizing:border-box;padding:10px;overflow: hidden;
}
.search_box span{float: left;margin-right:5px;line-height: 30px;}
.search_box input{width:35%;float: left;border:1px solid #ccc;box-sizing:border-box;padding:0 5px; height:30px;margin-right:5px;background: #fff;}
.search_box button{float:right;height:30px; padding:0 5px;border:1px solid #ccc; background: #fff;padding: 1px 5px;}
#order_count{width:100%;box-sizing:border-box;padding:0 10px;overflow: hidden;}
#order_count .data_items{width:50%;float: left;text-align: center;height: 30px;line-height: 30px;}
</style>


</head>
<body>
    <div class="search_box">
        <span>从</span>
        <input type="text" readonly="true" name="" id="begin_time" onclick="time_mod(this);" placeholder="开始日期">
        <span>到</span>
        <input type="text" readonly="true" name="" id="end_time" onclick="time_mod(this);" placeholder="今天">
        <button onclick="searchStart()">搜索</button>
    </div>
    <div id="order_count">
        
    </div>
	<div id="add"></div>
    
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/urlpath.js"></script>
<script>
	var iPage = 0;
    var countNum = 20;
    var begin_time = "";
    var end_time = "";
    apiready = function () {
        setRefreshHeader();
        setRefreshFooter();
        $api.html($api.byId("add"),""); //清空容器
        iPage=0 ;
        rendorOrderCount(begin_time,end_time); //渲染单数
        rendorSharecard(iPage,countNum,begin_time,end_time);//渲染乐享卡
    }
    function setRefreshHeader() { //下拉刷新
        api.setRefreshHeaderInfo({
            visible: true,
            bgColor: '#ccc',
            textColor: '#fff',
            textDown: '下拉刷新...',
            textUp: '松开刷新...',
            showTime: true
        }, function (ret, err) {
            $api.html($api.byId("add"),"");//清空容器
            iPage=0 ;
            begin_time = "";
            end_time = "";
            $api.val($api.byId("begin_time"),"");
            $api.val($api.byId("end_time"),"");
            $api.attr($api.byId("begin_time"),"val-data","");
            $api.attr($api.byId("end_time"),"val-data","");
            rendorOrderCount(begin_time,end_time); //渲染单数
            rendorSharecard(iPage,countNum,begin_time,end_time);//渲染乐享卡
            api.refreshHeaderLoadDone();
        });
    }
    function setRefreshFooter(){//上拉加载
        api.addEventListener(
            {
                name: 'scrolltobottom',
                extra:{
                    threshold:100
                }
            }, 
            function (ret, err) {
                iPage+=countNum;
                rendorSharecard(iPage,countNum,begin_time,end_time);//渲染乐享卡
                api.parseTapmode();
        });
    }
    function rendorOrderCount(begin_time,end_time){
        api.ajax({
            url: URLpath+'/ajax/call/vender_admin/order_count',
            method: 'post',
            data: {
                values: { 
                    "begin_time":begin_time,
                    "end_time":end_time
                }
            },
            timeout:5
        },function(ret, err){
            if (ret) {
                if(!ret || ret.errno ){
                    api.toast({
                        msg: ret.errmsg,
                        duration: 2000,
                        location: 'middle'
                    });
                }else{
                    
                    $api.html($api.byId("order_count"),"");//清空容器
                    $api.append($api.byId("order_count"),"<div class='data_items'>共"+ret.total_count+"单</div><div class='data_items'>今日"+ret.today_count+"单</div>");
                }
            } else {
                
            }
        });
    }
    function rendorSharecard(iPage,countNum,begin_time,end_time){
        api.showProgress({
            style: 'default',
            animationType: 'fade',
            title: '努力加载中...',
            text: '请稍候...',
            modal: false
        });
        api.ajax({
            url: URLpath+'/ajax/call/vender_admin/order_list',
            method: 'post',
            data: {
                values: { 
                    "start": iPage,
                    "count":countNum,
                    "begin_time":begin_time,
                    "end_time":end_time
                }
            },
            timeout:5
        },function(ret, err){
            api.hideProgress();
            if (ret) {
                if(!ret || ret.errno ){
                    // alert(ret.errmsg);
                    api.toast({
                        msg: ret.errmsg,
                        duration: 2000,
                        location: 'middle'
                    });
                    
                }else{
                    var res = ret.order_list ;
                    if(res.length > 0){
                        for(var j = 0; j < res.length; j++){
                            var trs = ""; 
                                trs += "<div class='data_items' order_id="+res[j].order_id+">";
                                trs += "<a href='javascript:void(0);' class='order_list_btn'>";
                                trs += "<div class='order_list order_title'>";
                                trs += "<div class='c_l'>" +res[j].goods_name+"</div>";
                                trs += "<span class='c_r'>x" + res[j].goods_number +"</span>";
                                trs += "</div>";
                                trs += "<div class='order_list order_content'>";
                                trs += "<div class='data_item'>";
                                trs += "<div class='c_l'>订单号:"+res[j].order_sn+"</div>";
                                // trs += "<span class='c_r'>支付:"+res[j].pay_fee+"</span>";
                                trs += "</div>";
                                trs += "<div class='data_item'>";
                                trs += "<div class='c_l'>电话:"+res[j].mobile+"</div>";
                                trs += "<span class='c_r'>优惠券抵扣:"+res[j].money_coupon+"元</span>";
                                trs += "</div>";
                                trs += "</div>";
                                trs += "<div class='order_list order_bottom'>";
                                var dateString = res[j].add_time;
                                var pattern = /(\d{4})(\d{2})(\d{2})(\d{2})(\d{2})(\d{2})/;
                                var formatedDate = dateString.replace(pattern, '$1-$2-$3 $4:$5:$6');
                                trs += "<div class='c_l'>"+formatedDate+"</div>";
                                trs += "<span class='c_r'>总金额:"+res[j].total_fee+"元</span>";
                                trs += "</div>";
                                trs += "</a>";
                                trs += "</div>";
                            $api.append($api.byId("add"),trs);
                        }
                    }else{
                        if($api.byId("no_data")){

                        }else{
                            $api.append($api.byId("add"),'<div id="no_data" style="line-height:30px;text-align:center;">没有更多数据</div>');
                        }
                    }
                }
            } else {
                api.confirm({
                    title: '系统提示',
                    msg: '网络请求超时，下拉刷新试试？',
                    buttons: ['确定']
                },function( ret, err ){
                    
                });
            }
        });
    }
    // function orderDetail(obj){   //订单详情页面
    //     var orderId = $api.attr(obj,'order_id');
    //     openWindow(orderId);
    // }
    // function openWindow(orderId){
    //     api.openWin({
    //         name: 'orderLayer',
    //         slidBackEnabled:false,
    //         url: URLpath+'/respagenew/call/venderappnew/html/orderLayer.html',
    //         animation:{
    //             type:"movein",                
    //             subType:"from_right",       
    //             duration:500,               
    //             curve:"ease_out"
    //         },
    //         pageParam:{
    //             'orderId':orderId
    //         }
    //     });
    // }
    function time_mod(thised){
        
        api.openPicker({
            type: 'date',
            title: '选择日期'
        },function( ret, err ){
            if( ret ){
                var year = ret.year+"";
                var month = ret.month<10?"0"+ret.month:ret.month+"";
                var day = ret.day<10?"0"+ret.day:ret.day+"";
                var upDate = year+month+day+"000000";
                var disDate= year+"-"+month+"-"+day;
                $api.val(thised,disDate);
                $api.attr(thised,"val-data",upDate);
                
            }else{
                alert( JSON.stringify( err ) );
            }
        });
    }
    function searchStart(){
        if($api.val($api.byId("begin_time")) == ""){
            api.toast({
                msg: "请选择开始日期",
                duration: 2000,
                location: 'middle'
            });
        }else{
            $api.html($api.byId("add"),"");//清空容器
            iPage=0 ;
            begin_time = $api.attr($api.byId("begin_time"),"val-data");
            end_time = $api.attr($api.byId("end_time"),"val-data");
            rendorOrderCount(begin_time,end_time); //渲染单数
            rendorSharecard(iPage,countNum,begin_time,end_time);//渲染乐享卡
        }
    }
</script>
</html>